<template>
	<view v-if="selfaddr">
			<view class="addresstip">您的地址已通知给发起方，请主要查收你的包裹。</view>
		<view class="content">
			<view class="addresstitle">收货地址</view>
			<view class="userinfo">
				<view class="contact-head">
					<image :src="userinfo.avatar" mode="aspectFill"></image>
					<view>{{userinfo.nickname}}<text style="color: #378aff;">（{{prizetitle[selfaddr.level]}}等奖）</text></view>
				</view>
			</view>
			<view class="contact-addr">
				{{selfaddr.address}}
			</view>
			<view class="addresstitle">发起人留言</view>
			<view class="win-message" v-if="selfaddr.remark">
				<text>{{selfaddr.remark}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	/**
	 * 中奖者自己的收货地址
	 */
	export default {

		data() {
			return {
				prizetitle: ['一', '二', '三', '四', '五'],
				selfaddr: '', //自己的地址信息
				userinfo: '',
			}
		},
		onLoad(option) {
			if (option.id) {
				this.getinitdata(option.id)
			}
			this.userinfo = uni.getStorageSync('user_info');
			//console.log(this.userinfo);
		},

		methods: {
			//获取列表数据
			
			getinitdata(id) {
				this.$HttRequest({
					url: '/lottery/orderDetail',
					param: {
						id: id,
					}
				}, 'GET', true).then((res) => {
					console.log(res);
					if (res.status === 10000) {
						this.selfaddr = res.data;
					} else {
						this.$ShowMsg(res.message);
					}
				}).catch((error) => {
					//异常错误
					this.$ShowMsg('网络连接失败');
					console.log(error)
				})
			}
		}
	}
</script>
<style lang="scss">
	page {
		background-color: #f0f0f0;
	}

	.addresstitle {
		font-size: 25rpx;
		color: #333;
		padding-left: 20rpx;
		margin: 20rpx 0;
	}

	.contact-box {
		display: flex;
		width: 100%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;

		.inputstyle {
			height: 60rpx;
			border-radius: 15rpx;
			border: 1rpx solid #f2f2f2;
			width: 100%;
			font-size: 28rpx;
			padding: 10rpx;
		}

		.contact-botton {
			color: #fff;
			width: 100%;
			height: 80rpx;
			background-color: $uni-color-primary;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 30rpx;
			margin: 20rpx auto;
			border-radius: 20rpx;
		}
	}

	.content {
		flex: 1;
		display: flex;
		flex-direction: column;
		margin: 20rpx 0;

		.userinfo {
			display: flex;
			justify-content: space-between;
			align-items: center;
			font-size: 28rpx;
			border-bottom: 1rpx solid #f2f2f2;
			padding: 20rpx 0;
			padding-left: 20rpx;
			background-color: #fff;
			.contact-head {
				display: flex;
				justify-content: center;
				align-items: center;

				image {
					margin-right: 10rpx;
					width: 50rpx;
					height: 50rpx;
					border-radius: 50%;
				}
			}

			.copy-addr {
				color: #fff;
				background-color: rgba(#000, 0.8);
				padding: 8rpx 15rpx;

				border-radius: 30rpx;
			}
		}

		.contact-addr {
			font-size: 28rpx;
			color: #abaaaa;
			background-color: #fff;
			padding: 30rpx 0;
			padding-left: 20rpx;
		}

		.win-message {
			padding: 20rpx 0;
			font-size: 28rpx;
			color: #333;
			display: flex;
			flex-direction: column;
			justify-content: flex-start;
			background-color: #fff;
			padding-left: 20rpx;
			text {
				margin: 5rpx 0;
			}
		}

		.contact {
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 32rpx;
			font-weight: bolder;
			color: $uni-botton-primary;
			padding: 20rpx 0;
		}
	}


	.addresstip {
		font-size: 28rpx;
		flex: 1;
		background-color: #fff;
		padding: 20rpx;
		color: #333;
		margin-top: 20rpx;
	}

	.duihuan {
		background-color: #fff;
		border-top: 1rpx solid #d7d7d7;
		display: flex;
		width: 100vw;
		position: fixed;

		align-items: center;
		justify-content: center;
		bottom: 0;

		.huan-button {
			background-color: $uni-botton-primary;
			width: 92%;
			height: 85rpx;
			border-radius: 40rpx;
			color: #fff;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 30rpx;
			margin: 20rpx 0;
		}
	}
</style>
